A HTML oldal struktúrája

Hogyan épül fel egy HTML oldal?


A <HEAD> rész egyik legtöbbet használt tag-je a <TITLE>...</TITLE> struktúra. E két tag közé szokás írni a weboldal címét. Ez fog megjelenni a böngésző címsorában is, tehát érdemes kitölteni, ne hagyjuk meg az alapértelmezett értéket, ami sokszor csupán a megnyitott fájl neve! 		A HTML oldalakat a <HTML> tag-gel fogjuk közre. A fájl legelejére és legvégére tesszük. A HTML oldalak két fő részből állnak: a fejrészből és a törzsből. A fejrészt a <HEAD> tag-gel, a törzset a <BODY> tag-gel határoljuk. Ha azt mondom, határoljuk, abból rájöhetsz, hogy itt is van nyitó- és zárótag is. Bár a böngészők mindegyike megérti azt is, ha nem tesszük ki ezeket a struktúrajelző elemeket, mégis azt ajánlom, a szabvány kedvéért írjuk ki őket! Néhány elemet például csak bizonyos helyre lehet elhelyezni. Ilyenek például a META tag-ek, amelyek a <HEAD> részben érzik jól magukat.

iDevice ikon META tag-ek leírása
TITLEAz oldalad címét adhatod meg benne. Használata: <META name="TITLE" content="Az oldal címe">
DESCRIPTIONAz oldal rövid leírását adhatod meg, a keresők sokszor ezt a szöveget írják ki a találati leírásban. Használata: <META name="DESCRIPTION" content="Ezt az oldalt én készítettem!">
KEYWORDSA oldal tartalmára jellemző kulcsszavak, amiket a keresőkbe beírva a kereső oldalunkat is meg kell találja. Ne használj sok szót, max. párszáz karakternyit. Használata: <META name="KEYWORDS" content="meta tag gyakorlás">
CONTENT-TYPEA kötelező META tag. Itt adhatjuk meg a weblap karakterkészletét. Ez biztosítja, hogy ékezethelyesen jelenjenek meg weboldalaink. Ennek hiányában egy esetleges idegen nyelvű környezetben ékezetes karaktereink furcsán (nem helyesen) jelenhetnek meg. Használata: <META http-equiv="CONTENT-TYPE" content="text/html; charset=iso-8859-2>
Az előző példa a közép-európai (ISO) szabványt jelenti, de nem csak erre van lehetőségünk. A gyakrabban használt karakterkészletek:
iso-8859-1 -> nyugat-európai [iso]
iso-8859-2 -> közép-európai [iso]
iso-8859-4 -> balti [iso]
windows-1250 -> közép-európai [windows]
utf-8 -> [UNICODE]
ROBOTSEz az elem a keresőrobotok oldalkövetését és oldalindexelését irányítja. Négy módon lehet ezt az elemet alkalmazni.
  • index, - az oldal tartalmát is átnézi és indexelheti azt
  • noindex, - az oldal tartalmát ne indexelje
  • follow, - az oldal linkjeit kövesse
  • nofollow, - az oldal linkjeit ne kövesse
Használható még az ALL = INDEX,FOLLOW, és a NONE = NOINDEX,NOFOLLOW érték is.
Példák:

<META name="ROBOTS" content="INDEX,FOLLOW">
<META name="ROBOTS" content="NOINDEX,FOLLOW">
<META name="ROBOTS" content="INDEX,NOFOLLOW">
<META name="ROBOTS" content="NOINDEX,NOFOLLOW">

Most hogy ilyen szépen átnéztük a META tag-ek igeny csekély hányadát, hadd áruljak el valamit: a CONTENT-TYPE kivételével alig használjuk valamelyiket. Ezek a tag-ek elsősorban a keresőrobotoknak adnak használható információkat, de mivel ezek sokszor lényegesen másféleképpen működnek, majdnem felesleges a használatuk. Sokan azt tartják, hogy több kárt okozunk velük, mivel úgy elállíthatjuk a keresőrobotokat, hogy nem fogják kategorizálni az oldalunkat. A Google például kimondottan büntet (tiltólistára tesz), ha a KEYWORDS blokk túl hosszú. Ezzel szemben a CONTENT-TYPE igen fontos lehet. Biztosan találkozunk már olyan webloldallal, ahol a betűk nem voltak ékezethelyesek. Ez jelentheti akár az "ű" betű helyett a "û" használata, de sokszor olvashatatlanná válik az oldal a tag (nem) használata miatt. Akkor lássuk a konkrét példát:


Ha a kiírás befejeződött, megjelenik egy nagyító a jobb alsó sarokban. Ha rákattintasz, megjelenik a forráskód eredménye.
A megjelenő ablakot be kell zárnod, ha folytatni akarod az munkát! Ja és a nagyítót csak az ügyesek találják el! :)